<template>
	<view class="content">
		<view class="topBox">
			<view class="users">
				<view class="user-header">
					<image src="https://cdn.uviewui.com/uview/album/1.jpg" mode=""></image>
					<view class="register">
						茶茶_7890
					</view>
				</view>
				<view class="users-bottom">
					<view class="users-item">
						<view class="num">12</view>
						<view class="users-content">余额</view>
					</view>
					<view class="users-item">
						<view class="num">200</view>
						<view class="users-content">积分</view>
					</view>
					<view class="users-item">
						<view class="num">1</view>
						<view class="users-content">礼品卡</view>
					</view>
				</view>
			</view>
		</view>

		<view class="bottomBox">
			<view class="order-list">
				<view class="order-item">
					<image src="https://cdn.uviewui.com/uview/album/1.jpg" width="25" height="25"></image>
					<view class="order-title">入会有礼</view>
				</view>
				<view class="order-item">
					<image src="https://cdn.uviewui.com/uview/album/1.jpg" width="25" height="25"></image>
					<view class="order-title">积分兑换</view>
				</view>
				<view class="order-item">
					<image src="https://cdn.uviewui.com/uview/album/1.jpg" width="25" height="25"></image>
					<view class="order-title">升级特权</view>
				</view>
				<view class="order-item">
					<image src="https://cdn.uviewui.com/uview/album/1.jpg" width="25" height="25"></image>
					<view class="order-title">生日特权</view>
				</view>
			</view>
		</view>

		<view class="listBox">
			<view class="lists">
				<uni-list>
					<uni-list-item :show-extra-icon="true" :extra-icon="iconList.extraIcon1" showArrow title="个人信息" clickable
						@click="clickList" rightText="右侧文字" />
					<uni-list-item :show-extra-icon="true" :extra-icon="iconList.extraIcon2" showArrow title="我的订单" clickable
						@click="clickList"/>
					<uni-list-item :show-extra-icon="true" :extra-icon="iconList.extraIcon3" showArrow title="用户反馈" clickable
						@click="clickList" />
					<uni-list-item :show-extra-icon="true" :extra-icon="iconList.extraIcon5" showArrow title="分享有礼" clickable
						@click="clickList" />
						<uni-list-item :show-extra-icon="true" :extra-icon="iconList.extraIcon4" showArrow title="更多服务" clickable
							@click="clickList" />
				</uni-list>
			</view>
		</view>
		<view class="version">
			版本 1.2.1
		</view>
	</view>
</template>

<script setup>
import { ref } from 'vue'
	const iconList = ref({
		extraIcon1: {
			color: '#666666',
			size: '22',
			type: 'auth'
		},
		extraIcon2: {
			color: '#666666',
			size: '22',
			type: 'compose'
		},
		extraIcon3: {
			color: '#666666',
			size: '22',
			type: 'chatboxes'
		},
		extraIcon4: {
			color: '#666666',
			size: '22',
			type: 'email'
		},
		extraIcon5: {
			color: '#666666',
			size: '22',
			type: 'gift'
		}
	})
	const clickList = () => {
		uni.showToast({
			title: "点击列表",
			icon: "none"
		})
	}
</script>

<style lang="scss" scoped>
	@import '~@/pages/mine/mine2.scss';
</style>